﻿<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
	<title>NetGraph Demo Page</title>
	<link rel="stylesheet" type="text/css" href="styles.css"/>
	<script type="text/javascript" src="lib/html.js"></script>
	<script type="text/javascript" src="lib/jquery-1.11.1.min.js"></script>
	<script type="text/javascript" src="lib/raphael-min.js"></script>
	<script type="text/javascript" src="netgraph.js"></script>
	<script type="text/javascript">
		var graph = new NetGraph({
			cnt:{name:"Центр"},
			o1:{name:"Офис 1", links:[["cnt",80]]},
			o4:{name:"Офис 4", links:[["cnt",80]]},
			o41:{name:"Офис 4.1", links:[["o4",40]]},
			o42:{name:"Офис 4.2", links:[["o4",40]]},
			o43:{name:"Офис 4.3", links:[["o4",40]]},
			o2:{name:"Офис 2", links:[["cnt",80]]},
			o3:{name:"Офис 3", links:[["cnt",80]]},
			o5:{name:"Офис 5", links:[["cnt",80]]},
			o51:{name:"Офис 5.1", links:[["o5",30]]},
			o52:{name:"Офис 5.2", links:[["o5",30]]},
			o53:{name:"Офис 5.3", links:[["o5",30]]},
			o54:{name:"Офис 5.4", links:[["o5",30]]},
			o55:{name:"Офис 5.5", links:[["o5",30]]},
			o56:{name:"Офис 5.6", links:[["o5",30]]}
		});
		graph.settings({
			initialPlacement:"grid",
			nodeSize:7,
			labelOffset:{x:0, y:25},
			nodeColor:"#cf0",
			gravityRate:.8,
			initialDistance:80
		});
		$(function(){
			graph.display("out", "report");
		});
	</script>
</head>
<body>
	<h1>NetGraph Demo Page</h1>
	<div id="out" style="width:800px; height:500px;"></div>
	<div id="report" style="width:800px; height:50px;"></div>
</body>
</html>